<template>
  <n-button @click="expand = !expand" round
            class="transition-all transition-500"
            style="padding-right: 10px; padding-left: 35px"
            :class="[expand?'-translate-x-1/4':'-translate-x-1/2']"
            secondary>
    <TextIcon v-if="expand" :size="25" icon="icon-park-outline:expand-right" tip="收回目录"></TextIcon>
    <TextIcon v-else icon="icon-park-outline:expand-left" tip="打开目录"></TextIcon>
  </n-button>
</template>

<script setup lang="ts">


import TextIcon from "@/components/pc/icon/TextIcon.vue";
import {useVModel} from "@vueuse/core";


const props = defineProps({
  isExpand: {
    type: Boolean,
    default: false
  }
})
const emit = defineEmits(['update:isExpand'])

const expand = useVModel(props, 'isExpand', emit)

</script>

<style scoped>


</style>